<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <f:view>
        <h:head>            
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <h:outputStylesheet library="css/theme" name="style.css" />
            <f:loadBundle var="label" basename="labels" />
            <title>#{label['title.app']}</title>
        </h:head>

        <h:body>
            <h:form>
                <p:idleMonitor onactive="sessionTimeOutDialog.show()" 
                               timeout="#{session.maxInactiveInterval * 1000}" />

                <p:dialog header="#{label['tiempo.inactividad']}" 
                          widgetVar="sessionTimeOutDialog"
                          modal="true" closable="false" width="400">
                    <h:outputText value="#{label['leyenda.inactividad']}" />
                </p:dialog>
            </h:form>
            <h:form>
                <p:panelGrid columns="2" >
                    <f:facet name="header">  
                        #{label['iniciar_session']} 
                    </f:facet>  
                    <p:outputLabel value="#{label['form.codigo']}" for="codigo"/><p:inputText id="codigo" value="#{sessionFlowumiUtil.usuario.codigo}" required="true"/>
                    <p:outputLabel value="#{label['form.contrasena']}" for="clave"/><p:password id="clave" value="#{sessionFlowumiUtil.usuario.password}" required="true"/>
                    <f:facet name="footer">
                        <p:commandButton value="#{label['iniciar_sesion']}" ajax="false" action="#{sessionFlowumiUtil.conectar()}"/>
                    </f:facet>
                </p:panelGrid>
            </h:form>
            <div id="mensajes">
                <p:messages /> 
            </div>
        </h:body>
    </f:view>
</html>
